<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script type="text/javascript" src="http://mat1.gtimg.com/libs/jquery/1.12.0/jquery.js"></script>
    <title>Title</title>
</head>
<body>
<table>
    <td><a href="{% url 'add' %}">增加</a></td>
    <td>根据新闻类型进行查询
        <select name="type" onclick="b()" id="select">
            <option value="1">体育</option>
            <option value="2">娱乐</option>
            <option value="3">科技</option>
            <option value="4">财经</option>
        </select><br>
    </td>
    <tr>
        <td>选择</td>
        <td>编号</td>
        <td>标题</td>
        <td>作者</td>
        <td>内容</td>
        <td>发布时间</td>
        <td>状态</td>
        <td>类型</td>
        <td>编辑</td>

    </tr>
    <tbody id="texts">
    {% for all in alls %}

        <tr>
            <td><input type="checkbox" name="hh" value="{{ all.id }}"></td>
            <td>{{ forloop.counter }}</td>
            <td>{{ all.nTitle }}</td>
            <td>{{ all.nAuthor }}</td>
            <td>{{ all.nContent }}</td>
            <td>{{ all.nPubDateTime }}</td>
            <td>{% if all.NStatus == True %}
                未审核
            {% else %}
                已审核
            {% endif %}
            </td>
            <td>{{ all.tid.tname }}</td>
            <td><a href="{% url 'delete' id=all.id %}">删除</a></td>
            <td><a href="{% url 'update' id=all.id sid=all.tid.id %}">修改</a></td>
        </tr>


    {% endfor %}
    </tbody>
    <tr>
        <td><a href="{% url 'deleteall' %}" onclick="a()">批量删除</a></td>
    </tr>

</table>
<script>
    function a() {
        var list = []
        var hh = document.getElementsByName('hh')
        for (var i = 0; i < hh.length; i++) {
            if (hh[i].checked === true) {
                console.log(hh[i].value);
                list.push(hh[i].value)
            }
        }
        if (list.length !== 0) {
            $.ajax({
                url: '{% url 'deleteall' %}',
                type: 'POST',
                data: ({
                    'list': list
                }),
                traditional: true, //传过来的值是多个的话,与要加这个
                {#async: false,#}
                success: function () {
                    alert('删除成功')
                },
                error: function () {
                    alert('删除失败')

                }
            })
        } else {
            var a = '请选择数据'
            alert(a)
        }
    }

    function b() {
        var nums = $('#select').val()
        {#console.log(nums);#}
        if (nums.length !== 0) {
            $.ajax({
                url: '{% url 'selects' %}',
                type: 'post',
                data: ({
                    'l': nums
                }),
                success: function (data) {
                    if (data == null || data == '') {
                        alert("没有该数据");
                    } else {

                        var html = ""
                        for (var i = 0; i < data.length; i++) {
                            html += '<tr><td>' + '<input type="checkbox" name="hh" value="{{ all.id }}">' + '</td>' +
                                '<td>' + data[i].id + '</td>' +
                                '<td>' + data[i].title + '</td>' +
                                '<td>' + data[i].author + '</td>' +
                                '<td>' + data[i].content + '</td>' +
                                '<td>' + data[i].time + '</td>' +
                                '<td>' + '{% if all.NStatus == True %}\n'+
                                    '                未审核\n'+
                                    '            {% else %}\n'+
                                    '                已审核\n'+
                                    '            {% endif %}' + '</td>' +
                                '<td>' + data[i].typp + '</td></tr>'


                        }
                        $('#texts').html(html) //#texts必须是原始for循环的上一级,否则会出现更新后的页面残留原始数据
                    }


                },
                error: function () {
                    alert('查询失败')
                }
            })
        } else {

        }
    }

</script>
</body>
</html>